<template>
  <div class="friend-chat-card">
    <UserHeader :avatar="avatar1" />
    <div class="friend-chat-card-content">friend123456</div>
  </div>
</template>

<script setup lang="ts">
import UserHeader from './UserHeader.vue'
import avatar1 from '@renderer/assets/img/im/avatar1.png'
</script>

<style lang="scss" scoped>
.friend-chat-card {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  &-content {
    padding: $padding_1;
    background: $color_5;
    border-radius: $padding_1;
    margin-left: $padding_1;
  }
}
</style>
